<template>
  <div class="publish">
    <carousel/>
    <navbar/>
    <edit/>
    <bestsale :publishBook1='publishBook1' :publishBook2='publishBook2'/>
    <new/>
    <focus/>
    <ebook/>
    <mystery/>
    <router-view/>
  </div>
</template>

<script>
import Carousel from '../components/publish/Carousel'
import Navbar from '../components/publish/Navbar.vue'
import Edit from '../components/publish/Edit.vue'
import Bestsale from '../components/publish/Bestsale.vue'
import New from '../components/publish/New.vue'
import Focus from '../components/publish/Focus.vue'
import Ebook from '../components/publish/Ebook.vue'
import Mystery from '../components/publish/Mystery.vue'

export default({
  data() {
    return {
      publishBook1:[],
      publishBook2:[]
    }
  },
  mounted() {
    this.axios.get('/book/publish').then(result=>{
      console.log(result);
      console.log(result.data);
      console.log(result.data.data);
      let arr1 = result.data.data.slice(0,5);
      let arr2 = result.data.data.slice(5,10);
      this.publishBook1.push(...arr1);
      this.publishBook2.push(...arr2);
    })
  },
  components:{
    Carousel, Navbar, Edit, Bestsale, New, Focus, Ebook, Mystery,
  }
})
</script>
